<template>
	<view class="code">
		<view class="code-input">
			<input type="number" v-model="iphone" :placeholder="type==0?'请输入手机号码 新号码既默认注册':'请输入手机号码'" />
		</view>
		<view class="code-btn">
			<button @click="sendCode">下一步</button>
		</view>
		<view style="display: flex;justify-content: center;align-items: center;">
			<checkbox-group  @change="onCheckboxChange">
				<checkbox :checked="checked"></checkbox>
			</checkbox-group>
			<view>我已阅读并同意</view>
			<navigator url="/bundle/pages/server_explan/server_explan?type=1" style="text-decoration: underline;color: #2482EE;">《隐私政策》</navigator>
			<view>和</view>
			<navigator url="/bundle/pages/server_explan/server_explan?type=0" style="text-decoration: underline;color: #2482EE;">《服务协议》</navigator>
		</view>
	</view>
</template>

<script>
	import {
		userLogout,

	} from "@/api/user";
	import {
		mapState,
		mapActions
	} from 'vuex'
	import {
		sendSms, //发送短信
		smsCodeLogin //验证码登录
	} from '@/api/app';
	import {
		SMSType
	} from "@/utils/type"

	export default {
		data() {
			return {
				iphone: '',
				type: 0 ,//0-验证码登录 1-绑定手机号码
				checked: true
			}
		},
		onLoad(options) {
			// console.log(options,!Object.keys(options).length == 0)
			if (!Object.keys(options).length == 0) {
				this.type = options.type;
				uni.setNavigationBarTitle({
					title: '绑定手机号'
				})
			}
		},
		onHide() {
			console.log('页面隐藏（可能被返回）');
			// 可以在这里记录状态，但不能阻止返回
		},
		onUnload() {
			console.log('页面卸载（确定被返回）');
			// 可以在这里执行返回前的逻辑
			if (this.type == 1) {
				// this.logout();

			}
		},
		computed: {
			...mapState(['token']),
			// ...mapActions(['getUser'])
		},
		methods: {
			onCheckboxChange(e) {
				console.log(e)
				// e.detail.value 是一个数组
				this.checked = e.detail.value.length > 0;
			},
			// end
			logout() {
				//  退出登录
				userLogout({
					token: this.token
				}).then(res => {
					if (res.code == 1) {
						this.$store.commit("LOGOUT");
                        uni.navigateBack();

					}
				})
			},
			sendCode() {
				var regex = /^(13[0-9]|14[01456789]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-356789])\d{7,8}$/;
				// 测试手机号是否匹配
				if (!regex.test(this.iphone)) {
					this.$toast({
						title: '请输入正确的手机号码'
					});
					return;
				}
				if(!this.checked){
					this.$toast({
						title: '注册前，请先阅读并勾选同意《隐私政策》和《服务协议》。'
					});
					return;
				}
				sendSms({
					mobile: this.iphone,
					key: this.type == 0 ? SMSType.LOGIN : SMSType.BIND
				}).then(res => {
					if (res.code == 1) {
						this.$toast({
							title: res.msg
						});
						if (this.type == 1) {
							uni.navigateTo({
								url: '/pages/login/code_send?mobile=' + this.iphone + "&type=1"
							})
						} else {
							uni.navigateTo({
								url: '/pages/login/code_send?mobile=' + this.iphone
							})
						}

					}
				})

			}
		}
	}
</script>
<style>
	page {
		background-color: #ffffff;
	}
</style>
<style lang="scss" scoped>
	.code {

		padding: 24rpx;

		.code-input {
			margin-top: 100rpx;
			padding: 40rpx;

			input {
				background-color: #f7f7f7;
				height: 90rpx;
				border-radius: 12rpx;
				padding-left: 20rpx;
				border: 1rpx solid #f7f7f7;
				width: 95%;
				color: #000000;

			}
		}

		.code-btn {
			margin-top: 300rpx;
			padding: 40rpx;
			button {
				width: 100%;
				// height: 80rpx;
				// padding: 10rpx;
				// height: 80rpx;
				background-color: #2482EE;
				color: #FFFFFF;
				// #ifdef MP-WEIXIN
				padding: 10rpx;
				//#endif
			}
		}

	}
</style>